<template>
    <div>
        <div class="title">投诉内容</div>
        <input type="text" v-model="matertitle" placeholder="" readonly/>
        <div  class="title">投诉描述（选填）</div>
        <textarea placeholder="输入投诉详情" v-model="content"></textarea>
        <div class="title">投诉内容</div>
        <input type="number" v-model="mobile" placeholder="请输入手机号或者微信号，方便联系到您"/>
        <button class="btn" @click="submit()">提交</button>
    </div>
</template>

<script>
    export default {
        name: "",
        data(){
            return{
                materialsid:"",
                matertitle:"",
                reason:"",
                content:"",
                mobile:""
            }
        },
        mounted(){
            this.materialsid=this.$route.query.id;
            this.matertitle=this.$route.query.matertitle;
            this.reason=this.$route.query.reason;
        },
        methods:{
            submit(){
                var that=this;
                if(!that.content){
                    that.$toast("请填写投诉详情");
                    return false;
                }
                if(!that.mobile){
                    that.$toast("请填写联系电话");
                    return false;
                }

                that.request1.post1({
                    url: that.Url + "api/complaint/complaintSave",
                    params: {
                        materialsid:that.materialsid,
                        reason:that.reason,
                        content:that.content,
                        mobile:that.mobile
                    },
                    success: function (res) {
//                        console.log(res)
                        if (res.data.code == 1) {
                            that.$toast.success("提交成功");
                            timer = setTimeout(function () {
                                that.$router.go(-2)
                            }, 2000)
                        } else {
                            alert(res.data.msg)
                        }
                    },
                    fail: function (error) {
//                        alert(error.data.msg)
                    }
                })
            }
        }
    }
</script>

<style scoped>
    .title{
        height: 42px;
        line-height: 48px;
        padding: 0 12px;
        box-sizing: border-box;
        font-size: 12px;
        color: #999;
    }
    input{
        width: 100%;
        height: 48px;
        padding: 0 12px;
        box-sizing: border-box;
        background: #fff;
        font-size: 14px;
        border: none;
    }
    textarea{
        width: 100%;
        height: 100px;
        padding: 10px 12px;
        box-sizing: border-box;
        background: #fff;
        font-size: 14px;
        border: none;
    }
    .btn{
        width: calc(100% - 24px);
        height: 42px;
        display: block;
        margin:30px auto 0;
        font-size: 14px;
        background: #27aa2a;
        border: none;
        border-radius: 5px;
        color: #fff;
    }
</style>